document.querySelector('#btn-login').addEventListener('click', async function (e) {
    e.preventDefault()
    // 1.收集数据
    const form = document.querySelector('form')
    const { username, password } = serialize(form, { hash: true, empty: true })
    // 2.校验数据
    // 是否为空
    if (username.trim().length === 0 || password.trim().length === 0) {
        return showToast('用户名或密码不能为空')
    }
    // 长度校验
    if (username.trim().length < 8 || username.trim().length > 30 || password.trim().length < 6 || password.trim().length > 30) {
        return showToast('用户名长度为8-30密码长度为6-30')
    }
    // 3.发送请求
    try {
        const data = await axios.post('/login', { username, password })
        // 如果能拿到data代表请求成功，登录成功
        // 后端告诉我是否登陆成功的标识：token
        console.log(data.data.token);
        // 后端告诉我登录后的用户名
        console.log(data.data.username);
        localStorage.setItem('token',data.data.token)
        localStorage.setItem('username',data.data.username)
        showToast('登录成功')
        setTimeout(() => {
            location.href = './index.html'
        }, 1000)
    } catch (err) {
        // 4.提示用户
        showToast(err.response.data.message)
    }
})